<template>
  <div class="list">
    <!-- <el-descriptions
    class="margin-top"
    :column="1"
  >
    
    <el-descriptions-item label="收货人">收货人</el-descriptions-item>
    <el-descriptions-item label="手机号码">手机号码</el-descriptions-item>
    <el-descriptions-item label="选择地区">选择地区</el-descriptions-item>
    <el-descriptions-item label="地址">
       地址
    </el-descriptions-item>
   
  </el-descriptions> -->
    <p>
        收货人:{{ item.name }}
        <el-button type="warning" plain v-if="$store.state.name == item.name"> 默认地址</el-button>
    </p>
    <p>手机号码:{{ item.tel }}</p>
    <p>选择地区:{{ item.area }}</p>
    <p>地址：{{ item.address }}</p>
    <div class="right">
      <el-button type="primary" link @click="setDefault(item.name)">{{$store.state.name == item.name?'':'设置默认'}}</el-button>
      <el-button type="primary" link @click="goEdit(item,index)">修改地址</el-button>
      <el-button type="danger" link @click="del(index)">删除地址</el-button>
    </div>
  </div>
</template>
<script>
import {reactive,toRefs} from 'vue'
import {useStore} from 'vuex'
import {useRouter, useRoute} from 'vue-router'
export default {
  props: ["item","index"],
  setup(props) {
    const {commit,state} =useStore()
    const del=(index)=>{
      commit('del',index)
    }
    
    const {push} = useRouter()
    const goEdit=(item,index)=>{
        push({path:'/about',query:{item:JSON.stringify(item),index:index}})
    }
    // 设置默认、
    const setDefault=(name)=>{
        
        if(state.name == name){
            name=''
        }
        console.log(name);
        commit('setDefault',name)

    }
    return {del,goEdit,setDefault}
  },
};
</script>
<style lang="scss" scoped>
p{
    line-height: 30px;
}
.right{
    float:right;
}
</style>

